<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/WEB-INF/include/tag.jsp" %>
<%@ include file="/WEB-INF/include/common.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="${ctx }/statics/css/loanPlan.css"/>
    <title>【贷款购车方案】</title>
    <style type="text/css">
       #plandata table td{
            text-align: center;
        }
        .thh3 {
            font-size: 14px;
            color: red;
        }

        .addbtn {
            position: relative;
            right: 25px;
        }

        .necessary {
            display: none
        }

        .insurance {
            display: none
        }

        .pull-right {
            cursor: pointer;
        }

        .color_red {
            color: red;
        }

        td {
            border-bottom: 1px solid #ddd;
        }
    </style>
</head>
<body>

<div style="margin-left: 50px;margin-right: 50px;">
    <nav class="navbar navbar-default" role="navigation">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand" href="#">购车方案</a>
            </div>
        </div>
    </nav>
    <!---end内容头部--->
    <!---star中间内容--->
    <div class="cont">
        <table class="table table-nod" width="100%" style="font-size: 14px;">
            <tbody>
            <tr>
                <td style="width: 570px">
                    <label for="brandId">选择车型:</label><select id="brandId" name="brandId" style="width: 120px">
                    <option value="0">品牌</option>
                    <c:forEach var="brand" items="${brandList}" varStatus="status">
                        <option value="${brand.id }">${brand.initial } ${brand.name }</option>
                    </c:forEach>
                </select>
                    <select id="seriesId" name="seriesId" style="width: 120px" title="车系">
                        <option value="0">车系</option>
                    </select>
                    <select id="modelId" name="modelId" style="width: 120px" title="车型">
                        <option value="0">车型</option>
                    </select>
                    <span>选择区域:</span>
                    <select id="provinceId" name="provinceId">
                        <c:forEach var="province" items="${provinceList}" varStatus="status">
                            <option value="${province.id }">${province.provinceNameEfirst } ${province.provinceName }</option>
                        </c:forEach>
                    </select>
                </td>
            </tr>
            <tr>
                <td style="width: 570px;"><span class="fontw">购车价格:</span>
                    <input id="guide_price" readonly="readonly" name="guidePrice" type="text" value="0" style="width: 120px;"><span class="addbtn">元</span>
                    <span hidden="true" id="old_model">全国指导价:<span id="oldPrice" class="color_red"></span>&nbsp;&nbsp;
                    <span id="nationwidePrice" class="color_red"></span>&nbsp;&nbsp;
                    <span id="active_car" class="color_red"></span></span>
                </td>
            </tr>
            </tbody>
        </table>
        <div>
            <div>
                <div style="padding-left: 10px;">
                    <input type="hidden" id="model_price" value="${rental/(1-payment/100) }">
                    <input type="hidden" id="brand" value="${brand }">
                    <input type="hidden" id="payment" value="${payment }">
                    <input type="hidden" id="installment" value="${installment }">
                    <div  id="sfbl" style="margin-bottom:10px">
                        <label>首付额度：</label>
                        <select name="payment" id="paymentId" style="width:100px;">
                            <option name="payment" value="0">0%</option>
                            <option name="payment" value="10">10%</option>
                            <option name="payment" value="20">20%</option>
                            <option name="payment" value="30">30%</option>
                            <option name="payment" value="40">40%</option>
                            <option name="payment" value="50">50%</option>
                            <option name="payment" value="60">60%</option>
                            <option name="payment" value="70">70%</option>
                            <option name="payment" value="80">80%</option>
                            <option name="payment" value="90">90%</option>
                            <option name="payment" value="100">100%</option>
                        </select>
                        <label>首付金额：</label>
                        <input type="text" name="custom" id="custom"/><br>
                        <div style="margin-top: 10px;">
                            <label>贷款期限：</label>
                            <select name="installment" id="installmentId" style="width:100px;">
                                <option value="6">半年</option>
                                <option value="12">一年</option>
                                <option value="18">一年半</option>
                                <option value="24">两年</option>
                                <option value="30">两年半</option>
                                <option value="36">三年</option>
                                <option value="42">三年半</option>
                                <option value="48">四年</option>
                                <option value="54">四年半</option>
                                <option value="60">五年</option>
                            </select>
                            <label>贷款总额：</label>
                            <input id="amount" name="amount" type="text" value="${rental }" style="height:25px;"><span class="addbtn">元</span>
                            <div>
                                <dt><span id="cankaozhi"></span></dt>
                            </div>
                        </div>
                    </div>

                    <div id="errorMessage" class="cd-controls cd-controls-inline " hidden="true"
                        style="margin-bottom: 10px;">
                        <dt style="color: red;letter-spacing: 3px;">提示：可贷款额度小于总贷款额，请提高贷款首付额度或选择合适的贷款周期！</dt>
                    </div>
                </div>
                <div id="detail_table">
                    <table class="table shoufu" width="100%">
                        <tbody>
                        <tr>
                            <th colspan="4" class="thh3"><span name="additional" class="pull-right"
                                                               onClick="openNecessary(this)">小计：<span
                                    id="additional">0</span>元  <i class="icon-double-angle-down"></i></span>税费
                            </th>
                        </tr>
                        <tr class="necessary">
                            <td width="18%">款项</td>
                            <td width="32%">选项</td>
                            <td width="18%">金额</td>
                            <td>明细</td>
                        </tr>
                        <tr class="necessary">
                            <td class="ltainput">购置税</td>
                            <td></td>
                            <td>
                                <input id="txtPurchaseTax" name="" class="input2" maxlength="8" value="0"
                                       disabled="true" type="text">元
                            </td>
                            <td class="col99">购置税＝购车款/(1+17%)×购置税率(7.5%)</td>
                        </tr>
                        <tr class="necessary">
                            <td class="ltainput">消费税</td>
                            <td></td>
                            <td>
                                <input id="txtExcise" name="" class="input2" maxlength="8" value="0" disabled="true"
                                       type="text">元
                            </td>
                            <td class="col99">该车型满足消费税免除条件</td>
                        </tr>
                        <tr class="necessary">
                            <td class="ltainput">上牌费用</td>
                            <td></td>
                            <td><input id="txtLicenseTax" readonly="readonly" name="" class="input3" maxlength="8"
                                       value="500" type="text">元
                            </td>
                            <td class="col99 pad10">通常商家提供的一条龙服务收费约500元，个人办理约373元，其中工商验证、出库150元、移动证30元、环保
                                卡3元、拓号费40元、行驶证相片20元、托盘费130元
                            </td>
                        </tr>
                        <tr class="necessary">
                            <td class="ltainput">车船使用税<span class="buybtn"><a href="javascript:void(0);" pop="true"
                                                                              popid="popUsageTax"></a>
            <div id="popUsageTax" class="btnpop" style="display: none;">
              <div class="svg-triangle"></div>
              <div class="btncont"></div>
              <div class="svg-triangle2"></div>
              <div class="btncont2">
                <div class="popclose"> </div>
                <p> 车船使用税是对行驶于公共道路的车辆和航行于国内河流、湖泊或领海口岸的船舶,按照其种类(如机动车辆、非机动车辆、载人汽车、载货汽车等)、吨位和规定的税额计算征收的一种使用行为税。</p>
              </div>
            </div>
            </span></td>
                            <td>
                                <ul class="list-inline">
                                    <li>
                                        <label>
                                            <input id="rdDisplacement10" name="rdDisplacement" value="1" type="radio"
                                                   checked="checked">
                                            1.0L（含）以下</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdDisplacement16" name="rdDisplacement" value="1.6" type="radio">
                                            1.0-1.6L（含）</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdDisplacement20" name="rdDisplacement" value="2.0" type="radio">
                                            1.6-2.0L(含）</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdDisplacement25" name="rdDisplacement" value="2.5" type="radio">
                                            2.0-2.5L（含）</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdDisplacement30" name="rdDisplacement" value="3.0" type="radio">
                                            2.5-3.0L（含）</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdDisplacement40" name="rdDisplacement" value="4.0" type="radio">
                                            3.0-4.0L（含）</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdDisplacement40s" name="rdDisplacement" value="4.1"
                                                   type="radio">
                                            4.0以上</label>
                                    </li>
                                </ul>
                            </td>
                            <td><input id="txtUsageTax" name="" class="input3" maxlength="8" value="0" type="text"
                                       readonly="readonly"> 元
                            </td>
                            <td class="col99 pad10">
                                <div>各省不统一，以北京为例(单位/年)。</div>
                                <ul class="list-inline">
                                    <li>1.0L(含)以下300元；</li>
                                    <li>1.0-1.6L(含)420元；</li>
                                    <li>1.6-2.0L(含)480元；</li>
                                    <li>2.0-2.5L(含)900元；</li>
                                    <li>2.5-3.0L(含)1920元；</li>
                                    <li>3.0-4.0L(含)3480元；</li>
                                    <li class="last">4.0L以上5280元；不足一年按当年剩余月算。</li>
                                </ul>
                            </td>
                        </tr>
                        <tr class="necessary">
                            <td class="ltainput">交通事故责任强制保险<span class="buybtn"></span></td>
                            <td>
                                <ul class="list-inline">
                                    <li>
                                        <label>
                                            <input id="rdSeatCount6" name="rdSeatCount" value="5" checked="checked"
                                                   type="radio">家用6座以下</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdSeatCount6s" name="rdSeatCount" value="6" type="radio">家用6座及以上</label>
                                    </li>
                                </ul>
                            </td>
                            <td><input id="txtTrafficInsurance" class="input2" maxlength="8" value="0" disabled="true"
                                       type="text"> 元
                            </td>
                            <td class="col99">家用6座以下950元/年，家用6座及以上1100元/年</td>
                        </tr>
                        <tr>
                            <th colspan="4" class="thh3"><span onClick="openInsurance(this)"
                                                               class="pull-right">商业保险小计：<span
                                    id="spanCommerceTotal">0</span>元  <i class="icon-double-angle-down"></i></span>商业保险
                            </th>
                        </tr>
                        <tr class="insurance">
                            <td width="18%">款项</td>
                            <td width="32%">选项</td>
                            <td width="18%">金额</td>
                            <td>明细</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbThirdCheck" name="cbThirdCheck" value="" checked="checked" type="checkbox">
                                第三者责任险</label>
                            </td>
                            <td class="pad10">
                                <div>赔付额度：</div>
                                <ul class="list-inline">
                                    <li>
                                        <label>
                                            <input id="rdThirdInsureClaim5" name="rdThirdInsureClaim" value="543"
                                                   type="radio">
                                            5万</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdThirdInsureClaim10" name="rdThirdInsureClaim" value="782"
                                                   checked="checked" type="radio">
                                            10万</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdThirdInsureClaim20" name="rdThirdInsureClaim" value="970"
                                                   type="radio">
                                            20万</label>
                                    </li>
                                    <br>
                                    <li>
                                        <label>
                                            <input id="rdThirdInsureClaim50" name="rdThirdInsureClaim" value="1315"
                                                   type="radio">
                                            50万</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdThirdInsureClaim100" name="rdThirdInsureClaim" value="1711"
                                                   type="radio">
                                            100万</label>
                                    </li>
                                </ul>
                            </td>
                            <td><input id="txtThirdInsurance" name="" class="input2" maxlength="8" disabled="true"
                                       value="0" type="text"> 元
                            </td>
                            <td class="col99"></td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbDamageCheck" name="cbDamageCheck" value="" checked="checked"
                                       type="checkbox">车辆损失险</label>
                            </td>
                            <td></td>
                            <td><input id="txtDamageInsurance" name="" class="input2" maxlength="8" disabled="true"
                                       value="0" type="text">元
                            </td>
                            <td class="col99">基础保费+裸车价格×1.0880%</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbStolenCheck" name="cbStolenCheck" value="" checked="checked"
                                       type="checkbox">全车盗抢险</label>
                            </td>
                            <td></td>
                            <td><input id="txtStolenInsurance" name="" class="input2" maxlength="8" disabled="true"
                                       value="0" type="text">元
                            </td>
                            <td class="col99">基础保费+裸车价格×费率</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbGlassCheck" name="cbGlassCheck" value="" checked="checked" type="checkbox">玻璃单独破碎险</label>
                            </td>
                            <td>
                                <ul class="list-inline">
                                    <li>
                                        <label>
                                            <input id="rdImport1" name="rdImport" value="1" type="radio"> 进口</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdImport0" name="rdImport" value="0" checked="checked"
                                                   type="radio">国产</label>
                                    </li>
                                </ul>
                            </td>
                            <td><input id="txtGlassInsurance" name="" class="input2" maxlength="8" disabled="true"
                                       value="0" type="text"> 元
                            </td>
                            <td class="col99">进口新车购置价×0.25%，国产新车购置价×0.15%</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbCombustCheck" name="cbCombustCheck" value="" checked="checked"
                                       type="checkbox">自燃损失险 </label>
                            </td>
                            <td></td>
                            <td><input id="txtCombustInsurance" name="txtCombustInsurance" class="input2" maxlength="8"
                                       value="0" disabled="true" type="text"> 元
                            </td>
                            <td class="col99">新车购置价×0.15%</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbNoDeductibleCheck" name="cbNoDeductibleCheck" value="" checked="checked"
                                       type="checkbox">不计免赔特约险</label>
                            </td>
                            <td></td>
                            <td><input id="txtNoDeductibleInsurance" name="" class="input2" maxlength="8" value="0"
                                       disabled="true" type="text"> 元
                            </td>
                            <td class="col99">(车辆损失险+第三者责任险)×20%</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbNoLiabilityCheck" name="cbNoLiabilityCheck" value="" checked="checked"
                                       type="checkbox">无过责任险</label>
                            </td>
                            <td></td>
                            <td><input id="txtNoLiabilityInsurance" name="" class="input2" maxlength="8" value="0"
                                       disabled="true" type="text"> 元
                            </td>
                            <td class="col99">第三者责任险保险费×20%</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbPassengerCheck" name="cbPassengerCheck" value="" checked="checked"
                                       type="checkbox">车上人员责任险</label>
                            </td>
                            <td></td>
                            <td><input id="txtPassengerInsurance" name="" class="input3" maxlength="8" value="0"
                                       type="text" readonly="readonly"> 元
                            </td>
                            <td class="col99">每人保费50元，可根据车辆的实际座位数填写</td>
                        </tr>
                        <tr class="insurance">
                            <td class="ltainput"><label>
                                <input id="cbCarBodyCheck" name="cbCarBodyCheck" value="" checked="checked"
                                       type="checkbox">车身划痕险</label>
                            </td>
                            <td>
                                <div>赔付额度：</div>
                                <ul class="list-inline">
                                    <li>
                                        <label>
                                            <input id="rdCarBodyInsure2000" name="rdCarBodyInsure" value="400"
                                                   type="radio">
                                            2千</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdCarBodyInsure5000" name="rdCarBodyInsure" value="570"
                                                   checked="checked" type="radio">
                                            5千</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdCarBodyInsure10000" name="rdCarBodyInsure" value="760"
                                                   type="radio">
                                            1万</label>
                                    </li>
                                    <li>
                                        <label>
                                            <input id="rdCarBodyInsure20000" name="rdCarBodyInsure" value="1140"
                                                   type="radio">
                                            2万</label>
                                    </li>
                                </ul>
                            </td>
                            <td><input id="txtCarBodyInsurance" name="" class="input2" maxlength="8" value="0"
                                       disabled="true" type="text">元
                            </td>
                            <td class="col99"></td>
                        </tr>
                        </tbody>
                    </table>
                    <table hidden="true" style="background-color: #FFFFFF" class="table table-bordered" border="0"
                           width="100%">
                        <tr>
                            <td align="center">
                                <img class="datalist-pic" src="https://x.autoimg.cn/j/logo/cjjr.jpg" width="80"
                                     height="60" style="margin-top:19px;">
                            </td>
                            <td><p>有家车贷</p>
                                <p>月供：4106 | 总成本：1.7万 | 贷款额：20万</p>利率：4.6%
                            </td>
                            <td><p>特点：</p>1、低价提车<br/>2、快速审批<br/>3、手续便捷</td>
                            <td><p>申请条件：</p>1、身份证<br/>2、稳定收入<br/>3、信用良好</td>
                            <td>
                                <button class="btn btn-primary btn-sm">快速申请</button>
                                <br/>
                                <button class="btn btn-primary btn-sm" style="margin-top: 10px">查看详情</button>
                            </td>
                        </tr>
                        <tr>
                            <td align="center">
                                <img class="datalist-pic" src="https://x.autoimg.cn/j/logo/df.jpg" width="80"
                                     height="60" style="margin-top:19px;">
                            </td>
                            <td><p>有家车贷</p>
                                <p>月供：4106 | 总成本：1.7万 | 贷款额：55万</p>利率：4.75%
                            </td>
                            <td><p>特点：</p>1、低价提车<br/>2、快速审批<br/>3、手续便捷</td>
                            <td><p>申请条件：</p>1、身份证<br/>2、稳定收入<br/>3、信用良好</td>
                            <td>
                                <button class="btn btn-primary btn-sm">快速申请</button>
                                <br/>
                                <button class="btn btn-primary btn-sm" style="margin-top: 10px">查看详情</button>
                            </td>
                        </tr>
                        <tr>
                            <td align="center">
                                <img class="datalist-pic" src="https://x.autoimg.cn/j/logo/thqc.jpg?v=2" width="80"
                                     height="60" style="margin-top:19px;">
                            </td>
                            <td><p>有家车贷</p>
                                <p>月供：4106 | 总成本：1.7万 | 贷款额：5万</p>利率：4.9%
                            </td>
                            <td><p>特点：</p>1、低价提车<br/>2、快速审批<br/>3、手续便捷</td>
                            <td><p>申请条件：</p>1、身份证<br/>2、稳定收入<br/>3、信用良好</td>
                            <td>
                                <button class="btn btn-primary btn-sm">快速申请</button>
                                <br/>
                                <button class="btn btn-primary btn-sm" style="margin-top: 10px">查看详情</button>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div id="plandata">

            </div>
        </div>
    </div>
    <p class="text-center">
        <small style="color: gray;">-------------------- 以上信息仅供参考 --------------------</small>
    </p>
</div>
</body>
<script type="text/javascript">
    var getProvinceId = function () {
        return $("#provinceId").val() == null ? 0 : $("#provinceId").val();
    };
    var setProvinceId = function (data) {
        $("#provinceId").val(data);
    };
    var getCustom = function(){
        return $("#custom").val() == null? 0:$("#custom").val();
    }
    //首付金额
    var setCustom = function(data){
        return $("#custom").val(data);
    }
    var getGuidePrice = function () {
        return $("#guide_price").val() == null ? 0 : $("#guide_price").val();
    };//价格
    var setGuidePrice = function (data) {
        $("#guide_price").val(data);
    };//价格
    var getPayment = function () {
        return $("#paymentId").val() == null ? 0 : $("#paymentId").val();
    };//首付额度
    var setPayment = function (data) {
        $("#paymentId").val(data);
        $("#paymentId").append('<option hidden name="payment" id="zi_payment" value="'+data+'">'+data+'%</option>').val(data);
    };//首付额度
    var getInstallment = function () {
        return $("#installmentId").val() == null ? 0 : $("#installmentId").val();
    };//贷款期限
    var setInstallment = function (data) {
        $("#installmentId").val(data);
    };//贷款期限
    var getAmount = function () {
        return $("#amount").val()==null?0:$("#amount").val();
    };//贷款总额
    var setAmount = function (data) {
        $("#amount").val(data);
    };//贷款总额
    var oldPrice = function () {
        return $("#oldPrice").val() == null ? 0 : $("#oldPrice").val();
    };//全国指导价
    var setOldPrice = function (data) {
        $("#oldPrice").val(data);
    };//全国指导价

    $(function () {

        //选择品牌
        $("#brandId").change(function () {
            var brandId = $(this).val();
            $.ajax({
                url: "${ctx}/web/car/getSeriesListByBrandId.do",
                type: "POST",
                data: {
                    "brandId": brandId
                },
                success: function (data) {
                    var html = '<option value="0">车系</option>';
                    var list = data.rows;
                    list.forEach(function (val, index, arr) {
                        html += '<option value="' + val.id + '">' + val.name + '</option>';
                    });
                    $("#seriesId").html(html);
                    $("#modelId").html('<option value="0">车型</option>');
                }
            });
        });
        //选择车系
        $("#seriesId").change(function () {
            var seriesId = $(this).val();
            $.ajax({
                url: "${ctx}/web/car/getModelListBySeriesId.do",
                type: "POST",
                data: {
                    "seriesId": seriesId
                },
                success: function (data) {
                    var html = '<option value="0">车型</option>';
                    var list = data.rows;
                    list.forEach(function (val, index, arr) {
                        html += '<option value="' + val.id + '">' + val.name
                            + '</option>';
                    });
                    $("#modelId").html(html);
                }
            });
        });
        //选择车型
        $("#modelId").change(function () {
            var modelId = $(this).val();
            var provinceId = getProvinceId();
            queryCar(modelId, provinceId);
        });
        //选择地区
        $("#provinceId").change(function () {
            var modelId = $("#modelId").val();
            var provinceId = $(this).val();
            queryCar(modelId, provinceId);
        });
        //选择首付比例下拉框
        $("#paymentId").change(function () {
            $("#zi_payment").remove();
            //计算 首付金额 和贷款金额
            var bili = $(this).val();
            //车型价格
            var jiage = getGuidePrice();
            var shoufu = jiage*bili/100;
            var daikuan = jiage-shoufu;
            setCustom(shoufu.toFixed(0));
            setAmount(daikuan.toFixed(0));
            if (daikuan != null && daikuan != 0) {
                toLoanPlan();
            }
        });
        //选择首付金额
        $("#custom").change(function(){
            $("#zi_payment").remove();
            var shoufu = $(this).val();
            if (isNaN(shoufu)) {
                alert("请输入正确的数值");
                return;
            }
            if (Number(shoufu) < 0) {
                alert("请输入正确的数值");
                return;
            }
            //计算 首付金额 和贷款金额
            //车型价格
            var jiage = getGuidePrice();
            var daikuan = jiage-shoufu;
            var bili = shoufu/jiage*100;
            if (Number(shoufu) > Number(jiage)) {
                alert("首付金额不能大于购车价格");
                return;
            }
            setPayment(bili.toFixed(2))
            setAmount(daikuan.toFixed(0));
            if (daikuan != null && daikuan != 0) {
                toLoanPlan();
            }
        });
        //选择贷款年限
        $("#installmentId").change(function () {
            var daikuan = getAmount();
            if (daikuan != null && daikuan != 0) {
                toLoanPlan();
            }
        });
        //选择贷款金额
        $("#amount").change(function () {
            $("#zi_payment").remove();
            var daikuan = $(this).val();
            var jiage = getGuidePrice();
            var shoufu = jiage-daikuan;
            var bili = shoufu/jiage*100;
            if (isNaN(daikuan)) {
                alert("请输入正确的数值");
                return;
            }
            if (Number(daikuan) < 0) {
                alert("请输入正确的数值");
                return;
            }
            if (daikuan > jiage) {
                alert("贷款额不能大于购车价格");
                return;
            }
            setPayment(bili.toFixed(2));
            setCustom(shoufu.toFixed(0));
            if (daikuan != null && daikuan != 0) {
                toLoanPlan();
            }
        });
        $("input[type=radio]").change(function () {
            jiSuanShouFu();
            if (getAmount() != null && getAmount() != 0) {
                toLoanPlan();
            }
        });
    });
    function queryCar(modelId, provinceId) {
        $.ajax({
            url: "${ctx}/web/car/getModelByModelId.do",
            type: "POST",
            data: {
                "modelId": modelId,
                "provinceId": provinceId
            },
            success: function (data) {
                var model = data.result;
                var guidePrice = model.guidePrice;
                var oldPrice = model.oldPrice;//优惠前地区价格
                var nationwidePrice = model.nationwidePrice;//全国价格
                var province = getProvinceId();
                province = $("#provinceId option[value=" + province + "]").text();
                $("#oldPrice").text(nationwidePrice);//全国指导价
                setGuidePrice(guidePrice.toFixed(0));//最终价格
                if (model.activitiesCar != null) {//有活动
                    $("#old_model").show();
                    if (nationwidePrice == oldPrice) {
                        $("#nationwidePrice").text("");
                    } else {
                        $("#nationwidePrice").text(province.substring(1, province.length) + " 价格：" + oldPrice);
                    }
                    //旧价格
                    var activeType = model.activitiesCar.activitiesType;
                    var rate = model.activitiesCar.activityRate;
                    var str = "";
                    if (activeType == "折扣") {
                        str = "折扣率： " + rate + "%";
                    } else {
                        str = "优惠活动减 " + rate;
                    }

                    $("#active_car").text(str);
                } else {
                    $("#active_car").text("");
                    if (nationwidePrice == oldPrice) {
                        $("#nationwidePrice").text("");
                        $("#old_model").hide();
                    } else {
                        $("#old_model").show();
                        $("#nationwidePrice").text(province.substring(1, province.length) + " 价格：" + oldPrice);
                    }
                }


                cheShen(model);
                jiSuanShouFu();
                openDetailTable();
                if (getAmount() != null && getAmount() != 0) {
                    toLoanPlan();
                }
            }
        });
    }
    //选择车型计算首付 贷款总额
    function jiSuanShouFu() {
        var cale = getPayment();//首付额度
        var guidePrice = getGuidePrice();//车型总额
        var payment_amount = (cale * guidePrice / 100).toFixed(0);//首付款
        setCustom(payment_amount);
        setAmount((guidePrice - payment_amount).toFixed(0));//贷款金额
        openDetailTable();
    }
    //开始计算
    function openDetailTable() {
        $("#detail_table").show();
        biYao();
        spanCommerceTotal();
        var shoufu = getCustom();
        var biyao = Number($("#spanCommerceTotal").text()) + Number($("#additional").text());
        var html = '<span>购车必要花费：<span class="color_red">' + biyao + '元</span>&nbsp;'
            + '贷款总额：<span class="color_red">' + Number($("#amount").val()).toFixed(0) + '元</span>';
        $("#cankaozhi").html(html);
    }
    //展开购车费用详情
    function openNecessary(data) {
        if ($(".necessary").is(":hidden")) {
            $(".necessary").show();
            $(data).find("i").attr("class", "icon-double-angle-up");
        } else {
            $(".necessary").hide();
            $(data).find("i").attr("class", "icon-double-angle-down");
        }
    }
    //展开商业保险详情
    function openInsurance(data) {
        if ($(".insurance").is(":hidden")) {
            $(".insurance").show();
            $(data).find("i").attr("class", "icon-double-angle-up");
        } else {
            $(".insurance").hide();
            $(data).find("i").attr("class", "icon-double-angle-down");
        }
    }
    //计算必要花费总额
    function biYao() {
        $("#txtPurchaseTax").val((getGuidePrice() / (1 + 0.17) * 0.075).toFixed(0));
        var xiaoji = 0;
        var chepai = $("#txtLicenseTax").val();
        if (isNaN(chepai)) {
            alert("请输入正确的数字");
            return;
        }
        if (Number(chepai) < 0) {
            alert("请输入正确的数字");
            return;
        }
        var model = {
            displacement: $("input[name=rdDisplacement]:checked").val(),
            trucSeat: $("input[name=rdSeatCount]:checked").val()
        };
        cheShen(model);
        $(".necessary").find("input[type=text]").each(function (index, domEle) {
            xiaoji += Number($(domEle).val());
        });

        $("#additional").text(xiaoji.toFixed(0));
    }
    //车船使用税和强制责任险
    function cheShen(model) {
        var id = 0;
        var displacement = model.displacement;
        var trucSeat = model.trucSeat;
        if (displacement <= 1) {
            id = 'rdDisplacement10';
            $("#txtUsageTax").val(300);
        } else if (displacement <= 1.6) {
            id = 'rdDisplacement16';
            $("#txtUsageTax").val(420);
        } else if (displacement <= 2) {
            id = 'rdDisplacement20';
            $("#txtUsageTax").val(480);
        } else if (displacement <= 2.5) {
            id = 'rdDisplacement25';
            $("#txtUsageTax").val(900);
        } else if (displacement <= 3) {
            id = 'rdDisplacement30';
            $("#txtUsageTax").val(1920);
        } else if (displacement <= 4) {
            id = 'rdDisplacement40';
            $("#txtUsageTax").val(3480);
        } else {
            id = 'rdDisplacement40s';
            $("#txtUsageTax").val(5280);
        }
        $("#" + id).prop("checked", true);
        if (trucSeat < 6) {
            $("#rdSeatCount6").prop("checked", true);
            $("#txtTrafficInsurance").val(950);
        } else {
            $("#rdSeatCount6s").prop("checked", true);
            $("#txtTrafficInsurance").val(1100);
        }
        $("#txtPassengerInsurance").val(50 * model.trucSeat);
    }


    //商业保险
    function spanCommerceTotal() {
        var jichu = 285;
        var zongji = 0;
        $(".insurance input[type=checkbox]").each(function (index, domEle) {
            if ($(domEle).is(":checked")) {
                var domname = $(domEle).attr("name");
                var data = $(domEle).parents("td").next().next().find("input[type=text]");
                if (getGuidePrice() == 0) {
                    $(data).val(0);
                } else {
                    $(domEle).parents("td").next().find("input[type=radio]:checked").each(function (index, item) {
                        var $input = $(item).parents("td").next().find("input[type=text]");
                        var name = $(item).attr("name");
                        var val = $(item).val();
                        if ("rdThirdInsureClaim" == name) {
                            $($input).val(val);
                        } else if ("rdImport" == name) {
                            if (val == 1) {//进口
                                $($input).val((getGuidePrice() * 0.0025).toFixed(0));
                            } else {//国产
                                $($input).val((getGuidePrice() * 0.0015).toFixed(0));
                            }
                        } else {
                            $($input).val(val);
                        }
                    });
                    if ("cbDamageCheck" == domname) {//车辆损失险   基础保费+裸车价格×1.0880%
                        $(data).val((jichu + getGuidePrice() * 0.01088).toFixed(0));
                    } else if ("cbStolenCheck" == domname) {
                        //基础保费+裸车价格×0.95%
                        $(data).val((jichu + getGuidePrice() * 0.0095).toFixed(0));
                    } else if ("cbCombustCheck" == domname) {
                        $(data).val((getGuidePrice() * 0.0015).toFixed(0));
                    } else if ("cbNoDeductibleCheck" == domname) {
                        //(车辆损失险+第三者责任险)×20%
                        $(data).val(( (jichu + getGuidePrice() * 0.01088 + Number($("input[name=rdThirdInsureClaim]:checked").val()) ) * 0.2).toFixed(0));
                    } else if ("cbNoLiabilityCheck" == domname) {
                        $(data).val(($("input[name=rdThirdInsureClaim]:checked").val() * 0.2).toFixed(0));
                    } else {
                    }
                }
                zongji += Number($(data).val());
            } else {
                $(domEle).parents("td").next().next().find("input[type=text]").each(function (index, item) {
                    $(this).prop("disabled", true);
                    $(this).val("0");
                });
            }
        });
        $("#spanCommerceTotal").text(zongji);
    }

    function toLoanPlan() {
        var rental = Number(getAmount());//贷款总额
        var brand = Number($("#brandId").val());//品牌
        var brandName = $("#brandId option[value=" + brand + "]").text();
        var installment = Number(getInstallment());//分期情况
        //首付金额
        var custom = getCustom();
        //车的总价格
        var grundPrice=getGuidePrice();
        var payment = Number(custom/grundPrice*100);//首付比例
        $.ajax({
            url: "${ctx}/web/loanPlan/getLoanPlan.do?guidePrice=" + rental + "&brandName=" + brandName + "&installment=" + installment + "&payment=" + payment + "&chejia=" + getGuidePrice(),
            type: "POST",
            success: function (data) {
                $("#pnum").text(data.length);
                if (data != null && data.length > 0) {
                    var h = "";
                    for (var i = 0; i < data.length; i++) {
                        var item = data[i];
                        var list = item.planList;
                        var str = "最省钱";
                        var type = 1;
                        if (i == 1) {
                            type=2;
                            str = "最快速"
                        }
                        if ( i == 2) {
                            type=3
                            str = "最便捷";
                        }
                        var style = ""
                        var html = '<div style="margin-top: 20px;">'
                            + '<div>'
                            + '<p class="text-center"><em id="pnum" style="color:red;font-size:26px">' + str + '</em></p>'
                            + '<p class="text-center"><label>还款总额：</label>'
                            + '<span style="height:25px;color:red;">' + item.totalMoney.toFixed(2) + '</span>元&nbsp;&nbsp;&nbsp;'
                            + '<label>总利息：</label>'
                            + '<span style="height:25px;color:red">' + item.totalAccrual.toFixed(2) + '</span>元&nbsp;&nbsp;&nbsp;'
                            + '<label>每月共还款：</label>'
                            + '<span style="height:25px;color:red">' + (item.totalMoney / installment).toFixed(2) + '</span>元&nbsp;&nbsp;&nbsp;'
                            + '<label>每月利息：</label>'
                            + '<span style="height:25px;color:red">' + (item.totalAccrual / installment).toFixed(2) + '</span>元&nbsp;&nbsp;&nbsp;'
                            + '</p></div>'
                            + '<table class="table table-bordered"><thead><tr>'
                            + '<th>产品名</th>'
                            + '<th>贷款额(元)</th>'
                            + '<th>还款额(元)</th>'
                            + '<th>利息(元)</th>'
                            + '<th>每月还款(元)</th>'
                            + '<th>最高比例</th>'
                            + '<th>最高额度(元)</th>'
                            + '<th>利率</th>'
                            + '<th>贷款期限</th>'
                            + '<th>办理场所</th>'
                            + '<th>办理周期</th>'
                            + '<th>是否抵押</th>'
                            + '</tr>'
                            + '</thead>'
                            + '<tbody>';
                        if (list != null && list.length > 0) {
                            for (var j = 0; j < list.length; j++) {
                                var loan = list[j].loanVo;
                                var place = loan.place;
                                if (place == 0) {
                                    place = "线上/线下";
                                } else if (place == 1) {
                                    place = "线上";
                                } else {
                                    place = "线下";
                                }
                                var isPledge = loan.isPledge == 0 ? "否" : "是";
                                html += '<tr>'
                                    + '<td>' + loan.productName + '</td>'
                                    + '<td>' + list[j].money.toFixed(2) + '</td>'
                                    + '<td>' + list[j].totalMoney.toFixed(2) + '</td>'
                                    + '<td>' + list[j].accrual.toFixed(2) + '</td>'
                                    + '<td>' + (list[j].totalMoney / getInstallment()).toFixed(2) + '</td>'
                                    + '<td>' + loan.amountScale + '%</td>'
                                    + '<td>' + loan.amount.toFixed(2) + '</td>'
                                    + '<td>' + loan.rate + '</td>'
                                    + '<td>' + getInstallment() + '月</td>'
                                    + '<td>' + place + '</td>'
                                    + '<td>' + loan.period + '工作日</td>'
                                    + '<td>' + isPledge + '</td>'
                                    + '</tr>';
                            }
                        }
                        html += '</tbody>'
                            + '</table>'
                            + '</div>';
                        h += html;
                        var url = "${ctx}/web/loanPlan/getAllLoanPlan.do?type=" + type + "&guidePrice=" + rental + "&brandName=" + brandName + "&installment=" + installment + "&payment=" + payment + "&chejia=" + getGuidePrice();
                        h += '<p class="text-center"><a class="text-center" target="_blank" href="' + url + '">查看更多>></a></p><hr>';
                    }
                    $("#plandata").html(h);
                } else {
                    $("#plandata").html('<p class="text-center" style="color:red">没有合适的贷款产品，请提高贷款首付额度或选择合适的贷款周期！</p>');
                }
            }
        });

    }

</script>
</html>
